import Vue from 'vue'
import App from './App.vue'
// 引入重置样式
// 为什么要重置样式呢？答：因为不同浏览器，对于不同标签设置的默认值是不同的，
// 所以为了统一所有浏览器中展示出来的项目效果一样，要重置样式(统一设置样式)。
import "./style/reset.less"

Vue.config.productionTip = false

// 6、引入封装的路由对象 -- 
import router from "./router/index"

// 全局注册vant组件
import {Search, Grid, GridItem, SwipeCell,List, PullRefresh, Tab, Tabs, ActionSheet, Dialog, Uploader, Icon, NavBar ,Cell, CellGroup, Form, Toast, Field,Button } from 'vant';

Vue.use(Search);
Vue.use(Grid);
Vue.use(GridItem);
Vue.use(SwipeCell);
Vue.use(List);
Vue.use(Field);
Vue.use(Button);
Vue.use(Toast);
Vue.use(Form);
Vue.use(Cell);
Vue.use(CellGroup);
Vue.use(NavBar);
Vue.use(Icon);
Vue.use(Uploader);
Vue.use(Dialog);
Vue.use(ActionSheet);
Vue.use(Tab);
Vue.use(Tabs);
Vue.use(PullRefresh)

// 全局注册自己封装的组件
import commentFooter from "@/components/commentFooter.vue"
Vue.component("commentFooter", commentFooter)

// 封装全局过滤器，用于拼接图片路径
// 过滤器只能用在v-bind和插值表达式中
import axios from "./utils/request"
Vue.filter("joinPath", (val)=>{
  // console.log(26,val);
  // 判断val不存在的时候，不处理val
  if(!val){return val} // 优化性能
  // 当val存在 且 传入的val有基地址的情况，这种情况也是不用处理，直接返回
  // 如果传入的val有基地址，则路径上一定会存在http，那么我就可以拿这个http来判断val是否存在基地址
  if(val&& val.indexOf("http") !=-1 ){
    return val
  }
  // 接口基地址拼接图片路径 形成完整的图片路径返回给使用者
  return axios.defaults.baseURL + val
})

// 全局指令，格式化日期
// Vue.directive("自定义指令名",{ inserted(el,binding){
//   el: 指的是使用该指令的标签
//   binding.value: 指的是使用指令时传入的值
//   inserted：当标签插入到页面中的时候触发的函数，以后都不会触发
// },update(el, binding){
//   update: 当传入的数据变化的时候触发（也就是binding.value的值变化的时候触发）
// } })
Vue.directive("formatDate",{
  inserted(el,binding){
    // console.log("inserted",el,binding);
    let time = null
    if(!binding.value){
      // 当传入的日期不存在则 返回当前日期
      time = new Date().toLocaleDateString()
    }
    // 日期存在，则根据传入的日期格式化
    time = new Date(binding.value).toLocaleDateString()
    // 设置标签内容
    el.innerText = time
  },
  update(el,binding){
    // console.log("update",el,binding);
    let time = null
    if(!binding.value){
      // 当传入的日期不存在则 返回当前日期
      time = new Date().toLocaleDateString()
    }
    // 日期存在，则根据传入的日期格式化
    time = new Date(binding.value).toLocaleDateString()
    // 设置标签内容
    el.innerText = time
  }
})

new Vue({
  // 7、路由对象注入到vue实例中
  router,
  render: h => h(App),
}).$mount('#app')
